import React, { useEffect, useState } from 'react'
import { Button, InfiniteScroll } from 'antd-mobile'
import axios from 'axios'
function AppTow() {
    const [dataList, setDataList] = useState([])
    const [page,setPage]=useState(1)
    const fiyrg = async () => {
        const res = await axios.get('/api/room/list')
        console.log(res)
        const newData = res.data.data.list
        setDataList([...dataList,...newData])
        setPage(page+1)
    }
    // useEffect(() => {
    //     fiyrg()
    // }, [])
    return (
        <div>
            <Button color='primary' fill='solid'>
                Solid
            </Button>
            <div>
                {dataList && dataList.map((item, index) =>
                    <dl>
                        <dt>
                            <img src={item.url} alt='' />
                        </dt>
                        <dd>
                            <p>{item.name}</p>
                            <p>{item.title}</p>

                        </dd>
                    </dl>
                )
                }
            </div>
             <InfiniteScroll loadMore={fiyrg} hasMore={true} />
        </div>
    )
}

export default AppTow
